import React, { PureComponent } from 'react';
import moment from 'moment';
import DescriptionList from '@/components/DescriptionList';

const { Description } = DescriptionList;
class BaseInfor extends PureComponent {
  componentDidMount() {}

  render() {
    const {
      data: { empSendInfoVo, empBaseInfoVo, matlist, insSerHdl, origInalRemark },
    } = this.props;
    return (
      <div>
        <h3>派单信息</h3>
        <DescriptionList style={{ marginBottom: 50, paddingLeft: '5%' }}>
          <Description term="签约方 ">
            {empSendInfoVo && empSendInfoVo.sendCorpName ? empSendInfoVo.sendCorpName : '--'}
          </Description>
          <Description term="客户名称">
            {empSendInfoVo && empSendInfoVo.custName ? empSendInfoVo.custName : '--'}
          </Description>
          <Description term="派单时间">
            {empSendInfoVo && empSendInfoVo.sendDate
              ? moment(empSendInfoVo.sendDate).format('YYYY-MM-DD HH:mm')
              : null}
          </Description>
          <Description term="最后一次修改时间">
            {empSendInfoVo && empSendInfoVo.lastUpdateDate
              ? moment(empSendInfoVo.lastUpdateDate).format('YYYY-MM-DD HH:mm')
              : null}
          </Description>
          <Description term="在职状态">
            {empSendInfoVo && empSendInfoVo.entryStatusName ? empSendInfoVo.entryStatusName : '--'}
          </Description>
          <Description term="所属客服">
            {empSendInfoVo && empSendInfoVo.blngCs ? empSendInfoVo.blngCs : '--'}
          </Description>
          <Description term="执行地">
            {empSendInfoVo && empSendInfoVo.areaName ? empSendInfoVo.areaName : '--'}
          </Description>
        </DescriptionList>
        <h3>基本信息</h3>
        <DescriptionList style={{ marginBottom: 50, paddingLeft: '5%' }}>
          <Description term="员工姓名">
            {empBaseInfoVo && empBaseInfoVo.empName ? empBaseInfoVo.empName : '--'}
          </Description>
          <Description term="证件类型">
            {empBaseInfoVo && empBaseInfoVo.certTypeName ? empBaseInfoVo.certTypeName : '--'}
          </Description>
          <Description term="证件号">
            {empBaseInfoVo && empBaseInfoVo.certNo ? empBaseInfoVo.certNo : '--'}
          </Description>
          <Description term="性别">
            {empBaseInfoVo && empBaseInfoVo.genderName ? empBaseInfoVo.genderName : '--'}
          </Description>
          <Description term="国籍">
            {empBaseInfoVo && empBaseInfoVo.nationName ? empBaseInfoVo.nationName : '--'}
          </Description>
          <Description term="出生日期">
            {empBaseInfoVo && empBaseInfoVo.birthDate
              ? moment(empSendInfoVo.birthDate).format('YYYY-MM-DD HH:mm')
              : null}
          </Description>
          <Description term="电话">
            {empBaseInfoVo && empBaseInfoVo.mobile ? empBaseInfoVo.mobile : '--'}
          </Description>
          <Description term="员工邮箱">
            {empBaseInfoVo && empBaseInfoVo.email ? empBaseInfoVo.email : '--'}
          </Description>
        </DescriptionList>
        <h3>业务信息</h3>
        <DescriptionList style={{ marginBottom: 50, paddingLeft: '5%' }} col={1}>
          <Description term="服务类型">
            {insSerHdl && insSerHdl.serTypeIdName ? insSerHdl.serTypeIdName : '--'}
          </Description>
          <Description term="是否有返款">
            {insSerHdl && insSerHdl.refundFlagName ? insSerHdl.refundFlagName : '--'}
          </Description>
          <Description term="收款方信息">
            {insSerHdl && insSerHdl.payeeName ? insSerHdl.payeeName : '--'}
          </Description>
          <Description term="收款方银行账号">
            {insSerHdl && insSerHdl.payeeBankcardNo ? insSerHdl.payeeBankcardNo : '--'}
          </Description>
          <Description term="开户行信息">
            {insSerHdl && insSerHdl.payeeBankOfDepo ? insSerHdl.payeeBankOfDepo : '--'}
          </Description>
        </DescriptionList>

        {matlist && matlist.length ? (
          <div>
            <h3>材料信息</h3>
            <DescriptionList style={{ marginBottom: 50, paddingLeft: '5%' }}>
              {matlist.map(item => (
                <Description key={item.inpVal} term={item.matName}>
                  {item.inpVal}
                </Description>
              ))}
            </DescriptionList>
          </div>
        ) : null}

        {origInalRemark && origInalRemark.length ? (
          <div>
            <h3>原件流转信息</h3>
            {origInalRemark.map(item => (
              <div key={item.content}>
                <DescriptionList style={{ marginBottom: 50, paddingLeft: '5%' }}>
                  <Description>
                    <span style={{ marginRight: 10 }}>
                      {moment(item.creTime).format('YYYY-MM-DD: hh:mm')}
                    </span>
                    <span style={{ marginRight: 10 }}>{item.creName}</span>
                    <span>{item.content}</span>
                  </Description>
                </DescriptionList>
              </div>
            ))}
          </div>
        ) : null}
      </div>
    );
  }
}

export default BaseInfor;
